'use client';
import { alipayPay } from '@/service';
import { useSetState } from 'ahooks';
import { Button } from 'antd';
import { useEffect } from 'react';

const Index = ({ id }) => {
  const [state, setState] = useSetState({
    formString: '',
  });
  useEffect(() => {
    getData();
  }, [id]);
  const getData = () => {
    if (!id) return;
    alipayPay({ id }).then((res) => {
      if (res.code === 200 && res.data) {
        setState({
          formString: res.data,
        });
      }
    });
  };
  return (
    <div>
      <iframe
        width="220"
        height="220"
        style={{
          padding: '9px',
          marginLeft: '2px',
        }}
        srcDoc={`<form name="punchout_form" method="post" action="${state.formString}">
<input type="hidden" name="biz_content" value="{&amp;quot;out_trade_no&amp;quot;:&amp;quot;1812819847146815488&amp;quot;,&amp;quot;product_code&amp;quot;:&amp;quot;FAST_INSTANT_TRADE_PAY&amp;quot;,&amp;quot;qr_pay_mode&amp;quot;:&amp;quot;4&amp;quot;,&amp;quot;subject&amp;quot;:&amp;quot;老鱼简历 年度会员&amp;quot;,&amp;quot;time_expire&amp;quot;:&amp;quot;2024-07-15 20:33:14&amp;quot;,&amp;quot;total_amount&amp;quot;:&amp;quot;78.8&amp;quot;}">
<input type="submit" value="立即支付" style="display:none" >
</form>
<script>document.forms[0].submit();</script>`}
      ></iframe>
    </div>
  );
};

export default Index;
